{"ast":null,"code":"var _jsxFileName = \"/data/messenger.client/src/components/Avatar/index.tsx\",\n  _s = $RefreshSig$();\nimport React from \"react\";\nimport { generateAvatarByNickname } from \"../../utils/helpers\";\nimport { Carousel } from \"../index\";\nimport classNames from \"classnames\";\nimport { observer } from \"mobx-react-lite\";\nimport { Context } from \"../../index\";\nimport './Avatar.scss';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nimport { Fragment as _Fragment } from \"react/jsx-dev-runtime\";\nconst Avatar = _ref => {\n  _s();\n  let {\n    contentList,\n    alt,\n    stringForGenerateColor,\n    stringForFirstCharacter,\n    shortAvatar = true,\n    selfProfile = false\n  } = _ref;\n  const {\n    store\n  } = React.useContext(Context);\n  const [collection, setCollection] = React.useState(null);\n  const {\n    colors\n  } = generateAvatarByNickname(stringForGenerateColor);\n  const firstChar = stringForFirstCharacter[0].toUpperCase();\n  React.useEffect(() => {\n    if (!shortAvatar && contentList !== null && contentList !== void 0 && contentList.items.length) {\n      setCollection(contentList.items.map((item, index) => {\n        return (contentList === null || contentList === void 0 ? void 0 : contentList.items.length) !== index + 1 && /*#__PURE__*/_jsxDEV(\"img\", {\n          className: \"avatar\",\n          src: process.env.REACT_APP_BACKEND_URL + '/' + item.link,\n          alt: 'Avatar ' + alt\n        }, index, false, {\n          fileName: _jsxFileName,\n          lineNumber: 30,\n          columnNumber: 29\n        }, this) || /*#__PURE__*/_jsxDEV(_Fragment, {\n          children: [/*#__PURE__*/_jsxDEV(\"img\", {\n            className: \"avatar\",\n            src: process.env.REACT_APP_BACKEND_URL + '/' + item.link,\n            alt: 'Avatar ' + alt\n          }, index, false, {\n            fileName: _jsxFileName,\n            lineNumber: 38,\n            columnNumber: 33\n          }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n            className: classNames('avatar', 'uploadAvatar'),\n            children: /*#__PURE__*/_jsxDEV(\"input\", {\n              type: \"file\",\n              accept: \"image/*\",\n              onChange: e => changeHandler(e)\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 48,\n              columnNumber: 37\n            }, this)\n          }, index + 1, false, {\n            fileName: _jsxFileName,\n            lineNumber: 44,\n            columnNumber: 33\n          }, this)]\n        }, void 0, true);\n      }));\n      //console.log(toJS(collection));\n    }\n  }, [contentList]);\n  const changeHandler = e => {\n    if (e.target.files && e.target.files[0]) {\n      const file = e.target.files[0];\n      e.target.value = '';\n      return store.uploadAvatar(file);\n    }\n  };\n  if (shortAvatar) {\n    if (contentList && contentList.items && contentList.items.length > 0) {\n      return /*#__PURE__*/_jsxDEV(\"img\", {\n        className: \"avatar\",\n        src: process.env.REACT_APP_BACKEND_URL + '/' + contentList.items[0].link,\n        alt: 'Avatar ' + alt\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 74,\n        columnNumber: 17\n      }, this);\n    } else {\n      return /*#__PURE__*/_jsxDEV(\"div\", {\n        style: {\n          background: `linear-gradient(135deg, ${colors.color} 0%, ${colors.colorLighten} 96.52%)`\n        },\n        className: \"avatar avatar--symbol\",\n        children: firstChar\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 82,\n        columnNumber: 17\n      }, this);\n    }\n  } else {\n    if (selfProfile) {\n      if (contentList && collection) {\n        return /*#__PURE__*/_jsxDEV(Carousel, {\n          width: 210,\n          children: collection\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 94,\n          columnNumber: 21\n        }, this);\n      } else {\n        return /*#__PURE__*/_jsxDEV(Carousel, {\n          width: 210,\n          customBackground: `linear-gradient(135deg, ${colors.color} 0%, ${colors.colorLighten} 96.52%)`,\n          children: [/*#__PURE__*/_jsxDEV(\"div\", {\n            className: \"avatar avatar--symbol\",\n            children: firstChar\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 103,\n            columnNumber: 25\n          }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n            className: classNames('avatar', 'uploadAvatar'),\n            children: /*#__PURE__*/_jsxDEV(\"input\", {\n              type: \"file\",\n              accept: \"image/*\",\n              onChange: e => changeHandler(e)\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 107,\n              columnNumber: 29\n            }, this)\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 106,\n            columnNumber: 25\n          }, this)]\n        }, void 0, true, {\n          fileName: _jsxFileName,\n          lineNumber: 100,\n          columnNumber: 21\n        }, this);\n      }\n    } else {\n      if (contentList && collection) {\n        if (contentList.items.length === 1) {\n          return /*#__PURE__*/_jsxDEV(\"img\", {\n            className: \"avatar\",\n            src: process.env.REACT_APP_BACKEND_URL + '/' + contentList.items[0].link,\n            alt: 'Avatar ' + alt\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 120,\n            columnNumber: 25\n          }, this);\n        } else {\n          return /*#__PURE__*/_jsxDEV(Carousel, {\n            width: 210,\n            children: collection\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 128,\n            columnNumber: 25\n          }, this);\n        }\n      } else {\n        return /*#__PURE__*/_jsxDEV(\"div\", {\n          style: {\n            background: `linear-gradient(135deg, ${colors.color} 0%, ${colors.colorLighten} 96.52%)`\n          },\n          className: \"avatar avatar--symbol\",\n          children: firstChar\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 135,\n          columnNumber: 21\n        }, this);\n      }\n    }\n  }\n};\n_s(Avatar, \"mOZ9fVRdI0gmsrzEORvcX33zSOA=\");\n_c = Avatar;\nexport default _c2 = observer(Avatar);\nvar _c, _c2;\n$RefreshReg$(_c, \"Avatar\");\n$RefreshReg$(_c2, \"%default%\");","map":{"version":3,"names":["React","generateAvatarByNickname","Carousel","classNames","observer","Context","Avatar","contentList","alt","stringForGenerateColor","stringForFirstCharacter","shortAvatar","selfProfile","store","useContext","collection","setCollection","useState","colors","firstChar","toUpperCase","useEffect","items","length","map","item","index","process","env","REACT_APP_BACKEND_URL","link","e","changeHandler","target","files","file","value","uploadAvatar","background","color","colorLighten"],"sources":["/data/messenger.client/src/components/Avatar/index.tsx"],"sourcesContent":["import React from \"react\";\nimport {AvatarProps} from \"../../models/props/AvatarProps\";\nimport { generateAvatarByNickname } from \"../../utils/helpers\";\nimport {Carousel} from \"../index\";\nimport classNames from \"classnames\";\nimport {observer} from \"mobx-react-lite\";\nimport {Context} from \"../../index\";\nimport './Avatar.scss';\n\nconst Avatar: React.FC<AvatarProps> = ({\n       contentList,\n       alt,\n       stringForGenerateColor,\n       stringForFirstCharacter,\n       shortAvatar = true,\n       selfProfile = false\n}) => {\n    const {store} = React.useContext(Context);\n    const [collection, setCollection] = React.useState<React.ReactNode | React.ReactNode[]>(null);\n\n    const {colors} = generateAvatarByNickname(stringForGenerateColor);\n    const firstChar = stringForFirstCharacter[0].toUpperCase();\n\n    React.useEffect(() => {\n        if (!shortAvatar && contentList?.items.length!) {\n            setCollection(\n                contentList.items.map((item, index) => {\n                    return (\n                        (contentList?.items.length !== index + 1 &&\n                            <img\n                                key={index}\n                                className='avatar'\n                                src={process.env.REACT_APP_BACKEND_URL + '/' + item.link}\n                                alt={'Avatar ' + alt}\n                            />\n                        ) ||\n                            <>\n                                <img\n                                    key={index}\n                                    className='avatar'\n                                    src={process.env.REACT_APP_BACKEND_URL + '/' + item.link}\n                                    alt={'Avatar ' + alt}\n                                />\n                                <div\n                                    key={index + 1}\n                                    className={classNames('avatar', 'uploadAvatar')}\n                                >\n                                    <input\n                                        type=\"file\"\n                                        accept=\"image/*\"\n                                        onChange={e => changeHandler(e)}\n                                    />\n                                </div>\n                            </>\n                    );\n                })\n            );\n            //console.log(toJS(collection));\n        }\n    }, [contentList]);\n\n    const changeHandler = (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (e.target.files && e.target.files[0]) {\n            const file: File = e.target.files[0];\n            e.target.value = '';\n\n            return store.uploadAvatar(file);\n        }\n    }\n\n    if (shortAvatar) {\n        if (contentList && contentList.items && contentList.items.length > 0) {\n            return (\n                <img\n                    className='avatar'\n                    src={process.env.REACT_APP_BACKEND_URL + '/' + contentList.items[0].link}\n                    alt={'Avatar ' + alt}\n                />\n            );\n        } else {\n            return (\n                <div\n                    style={{background: `linear-gradient(135deg, ${colors.color} 0%, ${colors.colorLighten} 96.52%)`}}\n                    className='avatar avatar--symbol'\n                >\n                    {firstChar}\n                </div>\n            );\n        }\n    } else {\n        if (selfProfile) {\n            if (contentList && collection!) {\n                return (\n                    <Carousel width={210} >\n                        {collection}\n                    </Carousel>\n                );\n            } else {\n                return (\n                    <Carousel width={210}\n                              customBackground={`linear-gradient(135deg, ${colors.color} 0%, ${colors.colorLighten} 96.52%)`}\n                    >\n                        <div className='avatar avatar--symbol'>\n                            {firstChar}\n                        </div>\n                        <div className={classNames('avatar', 'uploadAvatar')}>\n                            <input\n                                type=\"file\"\n                                accept=\"image/*\"\n                                onChange={e => changeHandler(e)}\n                            />\n                        </div>\n                    </Carousel>\n                );\n            }\n        } else {\n            if (contentList && collection!) {\n                if (contentList.items.length === 1) {\n                    return (\n                        <img\n                            className='avatar'\n                            src={process.env.REACT_APP_BACKEND_URL + '/' + contentList.items[0].link}\n                            alt={'Avatar ' + alt}\n                        />\n                    );\n                } else {\n                    return (\n                        <Carousel width={210} >\n                            {collection}\n                        </Carousel>\n                    );\n                }\n            } else {\n                return (\n                    <div\n                        style={{background: `linear-gradient(135deg, ${colors.color} 0%, ${colors.colorLighten} 96.52%)`}}\n                        className='avatar avatar--symbol'>\n                        {firstChar}\n                    </div>\n                );\n            }\n        }\n    }\n}\n\nexport default observer(Avatar);\n"],"mappings":"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"},"metadata":{},"sourceType":"module"}